<!DOCTYPE html>
<html lang="en" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns:th="http://www.thymeleaf.org"
>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" href="/css/custom.form.css">
</head>
<body>
<div class="layui-col-xs12 layui-col-md2">
    &nbsp;
</div>
<div>
    <div id="searchParam" >
        登记日期：
<!--        <div class="layui-input-inline" >-->
<!--            <input type="text" class="layui-input" id = "startdate" readonly placeholder="开始时间">-->
<!--        </div>-->
<!--        至&nbsp;-->
        <div class="layui-input-inline">
            <input type="text" class="layui-input"  id = "enddate" readonly placeholder="结束时间">
        </div>
        <button class="layui-btn layui-btn-sm" lay-event="search"   id="searchbydate" >辖区搜索</button>

    </div>
    <button class="layui-btn layui-btn-sm"  lay-event="return" id="return"   style="display: none;">返回辖区</button>
</div>


<div class="layui-col-xs12 layui-col-md2">
    &nbsp;
</div>
<div class="layui-col-xs12 layui-col-md8" style="align-content: center">
    <table class="layui-table" id="vsTable" lay-filter="vsTable" ></table>
    <table class="layui-table" id="viTable" lay-filter="viTable" hidden></table>
</div>





<script src="/layui/layui.all.js"></script>
<script src="/js/core.util.js"></script>

<script th:inline="none">
    var layer = layui.layer;
    var $ = jQuery = layui.jquery;
    var form = layui.form;
    var element = layui.element;
    var table ;
    var selectNode = {};
    var laydate = layui.laydate;
    // var startdate = $("#startdate");
    var enddate = $("#enddate");

    layui.config({
        base: '/layui-ext/'
    }) .use(['table','laydate','layer','jquery'], function () {
        table = layui.table;
        var reloadTreeTable = function () {
            var exportParams = {
                // startdate: startdate.val(),
                enddate: enddate.val(),
                sequence: 'desc',
            };
            CoreUtil.sendPost("/vaccination/statisticslist", exportParams, function (res) {
                renderTable(res.data);
            });
        };

        var reloadVillageTable = function (xzqh) {
            var exportParams = {
                xzqh:xzqh,
                // startdate: startdate.val(),
                enddate: enddate.val(),
                sequence:'desc'
            };
            CoreUtil.sendPost("/vaccination/villagelist", exportParams, function (res) {
                console.log(JSON.stringify(res.data));
                villageTable(res.data);
            });
        };
        // laydate.render({
        //     elem: "#startdate",
        //     trigger: 'click'
        // });
        laydate.render({
            elem: "#enddate",
            trigger: 'click',
            value: new Date()
        });

        reloadTreeTable();
        $('#searchbydate').click(function(){
            reloadTreeTable();
            layer.msg("查询成功");
        });



        var renderTable = function (data) {
            table.render({
                // 渲染表格
                data: data,
                elem: '#vsTable', // 表格id
                toolbar: '#toolbar',
                even:true,
                totalRow: true, //开启合计行
                limit: Number.MAX_VALUE,
                cols: [
                    [
                        {type:'numbers', title: '序号',align:'center'}
                        ,{field: 'mc', title: '所属辖区',align:'center' , totalRowText: '合计'}
                        ,{field: 'xzqh', title: '辖区编号',align:'center',width: '0%',  }
                        ,{field: 'lJSL', title: '累计接种数量',align:'center', totalRow: true}
                        ,{field: 'lJDYZ', title: '累计第一针',align:'center', totalRow: true}
                        ,{field: 'lJDRZ', title: '累计第二针',align:'center', totalRow: true}
                        ,{field: 'lJDSZ', title: '累计第三针',align:'center', totalRow: true}
                        ,{field: 'dRSL', title: '当日接种数量',align:'center', totalRow: true}
                        ,{field: 'dRDYZ', title: '当日第一针',align:'center', totalRow: true}
                        ,{field: 'dRDRZ', title: '当日第二针',align:'center', totalRow: true}
                        ,{field: 'dRDSZ', title: '当日第三针',align:'center', totalRow: true}

                    ]
                ],initSort:{
                    field:'lJSL',
                    type:'desc'
                },done: function () {
                    $("[data-field='xzqh']").css('display','none');
                }
            });
        };
        //点击返回按钮
        $('#return').click(function(){
            $(".layui-form.layui-border-box.layui-table-view").hide();
            $('#vsTable').show(1);
            //隐藏
            $('#return').hide();
            $('#searchParam').show();
            reloadTreeTable();
        });
        //table点击事件
        table.on('row(vsTable)', function(obj){
            document.getElementById("vsTable").style.display="none";
            $(".layui-form.layui-border-box.layui-table-view").hide();
            $("#viTable").show(1);
            $("#searchParam").hide();
            $("#return").show();
            var data = obj.data;
            reloadVillageTable(data.xzqh);
            //标注选中样式
            obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');

        });

        //行政村数据表加载
        var villageTable = function (data) {
            table.render({
                // 渲染表格
                data: data,
                elem: '#viTable', // 表格id
                toolbar: '#toolbar',
                even:true,
                totalRow: true, //开启合计行
                limit: Number.MAX_VALUE,
                cols: [
                    [
                        {type:'numbers', title: '序号',align:'center'}
                        ,{field: 'mc', title: '行政村',align:'center' , totalRowText: '合计'}
                        ,{field: 'lJSL', title: '累计接种数量',align:'center', totalRow: true}
                        ,{field: 'lJDYZ', title: '累计第一针',align:'center', totalRow: true}
                        ,{field: 'lJDRZ', title: '累计第二针',align:'center', totalRow: true}
                        ,{field: 'lJDSZ', title: '累计第三针',align:'center', totalRow: true}
                        ,{field: 'dRSL', title: '当日接种数量',align:'center', totalRow: true}
                        ,{field: 'dRDYZ', title: '当日第一针',align:'center', totalRow: true}
                        ,{field: 'dRDRZ', title: '当日第二针',align:'center', totalRow: true}
                        ,{field: 'dRDSZ', title: '当日第三针',align:'center', totalRow: true}

                    ]
                ],initSort:{
                    field:'count',
                    type:'desc'
                }

            });
        };


    });



</script>
</body>
</html>